import { ref, h } from "vue";
import { render,VMSpecsFormat } from "@/utils";
import DOMPurify from 'dompurify';
import multiLine from "common/multiLine.vue";
import usageRate from "common/usageRate.vue";
import systemType from "common/systemType.vue";
import TagStatus from "@/components/TagStatus/index.vue";
import LinkText from "@/components/LinkText/index.vue";

export const columns =[
  {
    title: "名称",
    dataIndex: "name",
    slotName: "name",
    fixed: "left",
    width: 180,
  },
  {
    title: "系统",
    dataIndex: "system",
    tooltip: true,
    ellipsis: true,
    width: 160,
    render: ({ record }) => h(systemType, { type:record?.osType,content:record?.osName  }),
  },
  {
    title: "规格",
    dataIndex: "flavor",
    slotName: "flavor",
    tooltip: true,
    ellipsis: true,
    width: 160,
  },
  {
    title: "IP",
    dataIndex: "vmIps",
    width: 150,
    render: ({ record }) => h(multiLine, { list: record.vmIps?.[0]?.ipAddresses?.map(item => item.ipAddress) }),
  },
  {
    title: "状态",
    dataIndex: "status",
    width: 90,
    render: ({ record }) => h(TagStatus, { type: record.vmStatus }),
  },
  {
    title: "负责人",
    dataIndex: "createBy",
    tooltip: true,
    ellipsis: true,
    width: 100,
    render
    // render: ({ record }) => h('div', [
    //   h('p', `创建：${record?.createBy || '-'}`),
    //   h('p', `运维：${record?.createBy || '-'}` || '-')
    // ]),
  },
  {
    title: "业务模型",
    dataIndex: "bizModelName",
    width: 180,
    render,
    // render: ({ record }) => h(multiLine, { type: record.status }),
  },
  {
    title: "ITPM项目",
    dataIndex: "itpm",
    slotName: "itpm",
    tooltip: true,
    ellipsis: true,
    width: 120,
    render,
  },
  {
    title: "创建信息",
    dataIndex: "lastTime",
    slotName: "lastTime",
    width: 180,
    render: ({ record }) =>h(LinkText, { label: record?.createTime, desc:record?.createBy}),
  },
  {
    title: "变更信息",
    dataIndex: "lastTime",
    slotName: "lastTime",
    width: 180,
    render: ({ record }) =>h(LinkText, { label: record?.lastTime, desc:record?.lastTime}),
  },
  {
    title: "操作",
    width: 180,
    dataIndex: "action",
    fixed: "right",
    slotName: "action",
  },
];
